﻿<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>SmartX Wallet</title>

    <!-- Bootstrap -->
    <link href="bootstrap/bootstrap.min.css" rel="stylesheet">
    <link href="js/mystyle.css" type="text/css" rel="stylesheet">


    <!-- 自定义样式 -->
    <style>
        .nav_box {
            height: 60px;
            position: relative;
            top: calc(50% - 30px);
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .qx_1 {
            display: flex;
            line-height: 70x;
            margin: -15px 5px 0 5px;
            padding: 0 18px 0 18px;
            font-size: 14px;
            position: relative;
        }

        body {
            padding-bottom: 48px;
            background: #fafafa;
        }

        .jumbotron {
            background-size: cover;
            padding-top: 7%;
            padding-bottom: 2%;
            background: #e5e5e5;
        }
    </style>
    
    <style>
        fieldset {
            background-color: #f1f1f1;
            border: none;
            border-radius: 2px;
            margin-bottom: 12px;
            overflow: hidden;
            padding: 0 .625em;
        }

        label {
            cursor: pointer;
            display: inline-block;
            padding: 3px 6px;
            text-align: left;
            width: 180px;
            vertical-align: top;
        }

        input {
            font-size: inherit;
            width: 300px;
        }
    </style>

<style>
.bBFMKx {
    box-sizing: border-box;
    margin: 0px;
    min-width: 0px;
    width: 100%;
    display: flex;
    padding: 0px;
    -webkit-box-align: center;
    align-items: center;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    justify-content: center;
}
.gByVwA {
    box-sizing: border-box;
    margin-top: 4px;
    min-width: 0px;
    width: 100%;
    border-radius: 16px;
    padding: 40px;
    border: 1px solid rgb(245, 245, 245);
    background-color: rgb(228 , 228 , 228 );
}
element.style {
    margin-top: 4px;
}
</style>

<style>
body {
    min-height: 100vh;
    background-position: 50% center;
    background-size: 100%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-image: url(././MoonSwap_files/bg-main.13b7b0cd.png);
}
.flat-form {
  background: #e74c3c;
  margin: 25px auto;
  width: 460px;
  height: auto;
  position: relative;
  font-family: 'Roboto';
  position: relative;
    max-width: 460px;
    width: 100%;
    background: rgb(255, 255, 255);
    box-shadow: rgba(0, 0, 0, 0.03) 0px 0.64rem 2.56rem 0.85rem, rgba(0, 0, 0, 0.05) 0px 0.48rem 1.49rem 0px, rgba(0, 0, 0, 0.08) 0px 0.32rem 0.85rem -0.43rem;
    border-radius: 30px;
    padding: 1rem;
}

.tabs {
    display: flex;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    align-items: center;
    border-radius: 3rem;
    justify-content: space-evenly;
    padding-left: 0px;   
}

.tabs li {
  display: block;
  float: left;
  margin: 0;
  padding: 0;
}
.tabs a {
    display: contents;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 3rem;
    border-radius: 3rem;
    outline: none;
    cursor: pointer;
    text-decoration: none;
    color: rgb(136, 141, 155);
    font-size: 20px;
}

.tabs li:last-child a {
  border-right: none;
  width: 174px;
  padding-left: 0;
  padding-right: 0;
  text-align: center;
}

.tabs a.active {
    border-radius: 12px;
    font-weight: 500;
    color: rgb(51, 51, 51);
}
.form-action {
  padding: 0 20px;
  position: relative;
}

.form-action h1 {
  font-size: 42px;
  padding-bottom: 10px;
}
.form-action p {
  font-size: 12px;
  padding-bottom: 10px;
  line-height: 25px;
}
form {
  padding-right: 20px !important;
}

.dark-box {
  background: #5e0400;
  box-shadow: 1px 3px 3px #3d0100 inset;
  height: 40px;
  width: 50px;
}
.form-action .dark-box.bottom {
  position: absolute;
  right: 0;
  bottom: -24px;
}
.tabs + .dark-box.top {
  position: absolute;
  right: 0;
  top: 0px;
}
.show {
  display: block;
}
.hide {
  display: none;
}

.button {
    border: none;
    display: block;
    background: #136899;
    height: 40px;
    width: 50%;
    color: #ffffff;
    text-align: center;
    border-radius: 5px;
    /*box-shadow: 0px 3px 1px #2075aa;*/
  	-webkit-transition: all 0.15s linear;
	  -moz-transition: all 0.15s linear;
	  transition: all 0.15s linear;
}

.button:hover {
  background: #1e75aa;
  /*box-shadow: 0 3px 1px #237bb2;*/
}

.button:active {
  background: #136899;
  /*box-shadow: 0 3px 1px #0f608c;*/
}

::-webkit-input-placeholder {
  color: #e74c3c;
}
:-moz-placeholder {
  /* Firefox 18- */
  color: #e74c3c;
}
::-moz-placeholder {
  /* Firefox 19+ */
  color: #e74c3c;
}
:-ms-input-placeholder {
  color: #e74c3c;
}
 </style>

</head>
<body>
    <script src="bootstrap/jquery.min.js"></script>
    <script src="bootstrap/bootstrap.min.js"></script>
    <!--<script type="text/javascript" src="js/crypto/encrypt/base/basex.js"></script>
    <script type="text/javascript" src="js/crypto/encrypt/base/base58.js"></script>
    <script type="text/javascript" src="js/crypto/encrypt/ed25519/nacl-fast.js"></script>
    <script type="text/javascript" src="js/crypto/utils/encrpt-ed25519.js"></script>-->

    <script type="text/javascript" src="crypto-master/js/encrypt/base/basex.js"></script>
    <script type="text/javascript" src="crypto-master/js/encrypt/base/base58.js"></script>
    <script type="text/javascript" src="crypto-master/js/encrypt/ed25519/nacl-fast.js"></script>
    <script type="text/javascript" src="crypto-master/js/utils/encrypt-ed25519-2.js"></script>

    <script src='js/bignumber.min.js'></script>
    <script type="text/javascript" src="js/crypto-js.js"></script>
    <script src='js/forge-sha256.min.js'></script>
    <script src='js/hashes.js'></script>
    <script src='js/wallet.js'></script>
    <script src='js/helper.js'></script>
    <script src='js/Login.js'></script>

    <div class="container">

        <div class="jumbotron">
            <h1>SmartX-dotnet <small id="statsLabel" style="font-size: 50%"></small></h1>
            <button type="button" class="btn btn-primary" onclick='OnRefresh()'>刷新</button>
            &nbsp;&nbsp;&nbsp;&nbsp;

        </div>

        <table class="table table-hover" id="LocksLabel">
            <thead id="thead_mytable111">
                <tr>
                    <th style="user-select:none">名称</th>
                    <th style='user-select:none;text-align:center;'>种类</th>
                    <th style='user-select:none;text-align:center;'>金额</th>
                    <th style='user-select:none;text-align:right;'>取回状态</th>
                </tr>
            </thead>
        </table>

        </div>
    </div>

    <footer class="navbar-fixed-bottom ">
        <center>
            <div style="width:50%;height:100%;overflow-x:auto;">
                <table class="table table-hover" id="statusbar" style='background:#ffffff'>
                </table>
            </div>
        </center>
        <div class="row nav_box navbar-inverse">
            <div class="qx_1"><a href="index.html"><h3 class="text-primary">钱包</h3></a></div>
            <div class="qx_1"><a href="browser.html"><h3 class="text-success">区块</h3></a></div>
            <div class="qx_1"><a href="rules.html"><h3 class="text-danger">节点</h3></a></div>
            <div class="qx_1"><a href="setting.html"><h3 class="text-warning">设置</h3></a></div>
        </div>
    </footer>

    <script>

        function liOnclick(e) {
            //alert(e.id);
        };
        function OnRefresh(e) {
            window.location.href = window.location.href;
        };

        // 地址栏参数
        function getQueryVariable(variable, search) {
            if (search == null)
                search = window.location.search;
            var query = search.substring(1);
            var vars = query.split("&");
            for (var i = 0; i < vars.length; i++) {
                var pair = vars[i].split("=");
                if (pair[0] == variable) { return pair[1]; }
            }
            return (false);
        }

        var addressCur = getQueryVariable("address");
        var tokenAddress = "";
        var amountCur = 0;
        var nonceCur = 0;
        var colorindex = 1
        var colorlist = ["list-group-item-success", "", "list-group-item-info", "", "list-group-item-warning", "", "list-group-item-danger", ""];
        var platform = Helper.checkPlatform();

        let curHeight = 1;
        function QueryStats() {
            $.ajax({
                url: Helper.GetServerIP() + "/Stats",
                dataType: "text",
                type: "get",
                data: { style: "1" },
                success: function (data) {

                    var element = document.getElementById("statsLabel");
                    element.innerHTML = data;

                    var height = data.split(" ")[0].replace("H:", "");
                    curHeight = parseInt(height);

                },
                error: function (err) {
                }
            });
        }
        QueryStats();

        function OnRefreshAmount() {
            $.ajax({
                url: Helper.GetServerIP() + "/balanceOf",
                dataType: "text",
                type: "get",
                data: { Address: addressCur, token: "" },
                success: function (data) {
                    var jsonObj = JSON.parse(data);
                    var amount = new BigNumber(jsonObj["amount"]).toFormat();
                    var nonce = parseInt(jsonObj["nonce"]);
                    amountCur = amount;
                    nonceCur = nonce + 1;
                },
                error: function (err) {
                }
            });
            setTimeout(function () { OnRefreshAmount(); }, 3000);
        }
        OnRefreshAmount();

        let Symbols = [];
        let Symbols_Inverse = [];
        Symbols[Helper.ERCSat()] = "SAT";
        Symbols_Inverse["SAT"] = Helper.ERCSat();

        async function getSymbol(tokenAddress) {
            return new Promise((resolve, reject) => {
                if (Symbols[tokenAddress] != null) {
                    return resolve(Symbols[tokenAddress]);
                }
                $.ajax({
                    url: Helper.GetServerIP() + "/callFun",
                    dataType: "text",
                    type: "get",
                    data: { consAddress: tokenAddress, data: "symbol()" },
                    success: function (data) {
                        if (data.indexOf("error") == -1) {
                            var jsonObj1 = JSON.parse(data);
                            console.log(jsonObj1);
                            Symbols[tokenAddress] = jsonObj1;
                            Symbols_Inverse[jsonObj1] = tokenAddress;
                            resolve(Symbols[tokenAddress]);
                        }
                        else {
                            resolve(null);
                        }
                    },
                    error: function (err) {
                        resolve(null);
                    }
                });
            })
        }

        TableInsert3 = function () 
        {
            var innerHTML = "<tbody><tr class='mycolor' id='myid' onclick='liOnLockRetrieved(this)'>";
            innerHTML = innerHTML.replace(/myid/g, arguments[1]);
            innerHTML = innerHTML.replace(/mycolor/g, arguments[2]);

            innerHTML += "<td style='vertical-align:middle;'>" + arguments[3] + "</td>";
            innerHTML += "<td style='text-align:center;vertical-align:middle;'>" + arguments[4] + "</td>";
            innerHTML += "<td style='text-align:center;vertical-align:middle;'>" + arguments[5] + "</td>";
            innerHTML += "<td style='text-align:right;vertical-align:middle;'>" + arguments[6] + "</td.amount>";
            innerHTML += '</tr ></tbody>';

            var item_new = document.createElement("tbody");

            item_new.innerHTML = innerHTML;
            document.getElementById(arguments[0]).appendChild(item_new);
        }

        function onInit() {
            $.ajax({
                url: Helper.GetServerIP() + "/callFun",
                dataType: "text",
                type: "get",
                data: { consAddress: Helper.LockFactory(), data: 'allowance(\"' + addressCur + '\")' },
                success: function (data) {
                    onInit_async(data);
                },
                error: function (err) {
                }
            });
        }

        let Retrieved_Transfer_Hash = [];

        async function onInit_async(data) {
            var jsonObj = JSON.parse(JSON.parse(data));
            //console.log(jsonObj);

            colorindex = 1;
            for (var key in jsonObj) {
                var color = colorlist[(colorindex - 1) % colorlist.length]; colorindex++;

                var state = "";
                if (parseInt(jsonObj[key].LockHeight) < curHeight) {
                    state = "<button type=\"button\" class=\"btn btn-danger\" onclick='liOnLockRetrieved(" + jsonObj[key].LockHeight + ")'>取回</button>";
                }
                else {
                    var height = parseInt(jsonObj[key].LockHeight) - curHeight;
                    if (new BigNumber(height / 240).toFormat(0) != "0")
                        state = new BigNumber(height / 240).toFormat(0) + "小时后可取回"
                    else
                        if (new BigNumber(height / 240).multipliedBy(60).toFormat(0) != "0")
                            state = new BigNumber(height / 240).multipliedBy(60).toFormat(0) + "分钟后可取回"
                        else
                            state = "小于1分钟后可取回"
                }
                let tokenA = await getSymbol(jsonObj[key].tokenA);
                TableInsert3("LocksLabel", jsonObj[key].LockHeight, color, jsonObj[key].Name, tokenA,jsonObj[key].Amount, state);
            }
        }

        onInit();

        function liOnLockRetrieved(LockHeight) {
            if (Retrieved_Transfer_Hash[LockHeight] != null) {
                alert("已提交,请不要多次点击");
                return;
            }
            if (typeof (LockHeight) != 'number')
                return;

            let addressOut = Helper.LockFactory();
            let data = 'retrieved(\"' + LockHeight + '\")';
            let depend = '';
            let remarks = '';

            console.log(addressOut + ' ' + data);

            var hash = Helper.SendTransferSubmit(null, "contract", '', addressOut, data, depend, nonceCur, remarks);
            Retrieved_Transfer_Hash[LockHeight] = hash;

            $("#ModalPledge").modal('hide');
            Helper.Statusbar("statusbar", hash, "", "合约: " + addressOut + " 取回锁仓,序号: " + LockHeight, 1, nonceCur);
            Helper.MessageBox('取回锁仓已提交');

        }

        Helper.Statusbar();
    </script>



</body>
</html>

